import { computed, defineComponent, PropType, ref } from 'vue';
import { useNamespace } from '@ibiz-template/vue3-util';
import { IDEFormRawItem } from '@ibiz/model-core';
import { CheckinGroupTitleController } from './checkin-group-title.controller';
import './checkin-group-title.scss';

export const CheckinGroupTitle = defineComponent({
  name: 'IBizCheckinGroupTitle',
  props: {
    modelData: {
      type: Object as PropType<IDEFormRawItem>,
      required: true,
    },
    controller: {
      type: CheckinGroupTitleController,
      required: true,
    },
  },
  setup(props) {
    const ns = useNamespace('checkin-group-title');
    const formIndex = ref(0);
    const c = props.controller;

    const form = c.form;
    const view = form.view;
    const outForm = view.getController('form');
    const scopesdata = computed(() => {
      return (outForm?.state as IData).data?.scopes || [];
    });
    formIndex.value = form.getSimpleDataIndex();
    return {
      ns,
      formIndex,
      scopesdata,
    };
  },
  render() {
    if (!this.controller.state.visible || this.scopesdata.length < 2) {
      return null;
    }
    return <h4 class={this.ns.b()}>第{this.formIndex + 1}次上下班：</h4>;
  },
});
